<template>
  <!--提交开题报告-->
  <div class="opening-report">
    <InnerBreadcrumb v-model="indexKey" :path="breadPath" :label-args="{name: breadName}" :showBack="true" />
    <div class="edu-page-warp" v-show="indexKey === 'MAIN'">
      <el-card shadow="never">
        <div class="edu-page-title">{{$t('graduationDesign.graduationDesignOpeningReport')}}</div>
        <div class="edu-opertion-bar">
          <div class="float-right">
            <el-button @click="onExport" v-loading.fullscreen.lock="loading" element-loading-text="Loading" element-loading-spinner="el-icon-loading" element-loading-background="rgba(255, 255, 255, .48)">{{$t('graduationDesign.exportPdf')}}</el-button>
            <el-button type="primary" @click="onAdd">{{$t('graduationDesign.addOpeningReport')}}</el-button>
          </div>
        </div>
        <edu-table ref="submitOpeningReportTable" :url="getList" @selection-change="handleSelectChange">
          <edu-table-column :label="$t('graduationDesign.graduationYear')" prop="grade" min-width="80"></edu-table-column>
          <edu-table-column :label="$t('graduationDesign.subjectName')" prop="projectName" min-width="100"></edu-table-column>
          <edu-table-column :label="$t('graduationDesign.tutor')" prop="teacherName" min-width="100"></edu-table-column>
          <edu-table-column :label="$t('graduationDesign.submitTime')" prop="submitTime" min-width="110"></edu-table-column>
          <edu-table-column :label="$t('graduationDesign.openingReportStatus')" min-width="120">
            <template slot-scope="scope">
              <el-tag v-if="scope.row.status === 'WaitCommit'" type="info">{{$t('graduationDesign.draft')}}</el-tag>
              <el-tag v-else-if="scope.row.status === 'Process'" type="info">{{$t('graduationDesign.pendingReview')}}</el-tag>
              <el-tag v-else-if="scope.row.status === 'Reject'" type="danger">{{$t('graduationDesign.rejected')}}</el-tag>
              <el-tag v-else-if="scope.row.status === 'End'" type="success">{{$t('graduationDesign.passed')}}</el-tag>
            </template>
          </edu-table-column>
          <edu-table-column :label="$t('graduationDesign.operation')" min-width="120">
            <template slot-scope="scope">
              <el-button type="text" @click="onEdit(scope.row)" v-if="scope.row.status === 'WaitCommit' || scope.row.status === 'Reject'">{{$t('graduationDesign.edit')}}</el-button>
              <el-button type="text" @click="onRevoke(scope.row)" v-if="scope.row.status === 'Process'">{{$t('graduationDesign.revoke')}}</el-button>
              <el-button type="text" @click="onDelete(scope.row)" v-if="scope.row.status === 'WaitCommit'">{{$t('graduationDesign.delete')}}</el-button>
              <el-button type="text" @click="onView(scope.row)">{{$t('graduationDesign.view')}}</el-button>
            </template>
          </edu-table-column>
        </edu-table>
      </el-card>
    </div>
    <div v-if="indexKey === 'OPENING_REPORT'">
      <OpeningReportInfo :actionType="actionType" :studentForm="studentForm" :openingReportForm="openingReportForm" :progressData="progressData" :stuType="stuType" @opening-report-submit="onSubmit" @opening-report-save="onSave" @opening-report-cancel="onCancel"></OpeningReportInfo>
    </div>
  </div>
</template>
<script>
import API from "common/src/api/underGraduationDesign/openingReport";
import tools from 'common/src/views/underGraduationDesign/tools.js';
export default {
  name: 'submitOpeningReport',
  data() {
    return {
      api: API,
      getList: '/api/designservice/openReport/list',
      queryForm: {},
      indexKey: 'MAIN',
      breadPath: {
        label: this.$t('graduationDesign.submitOpeningReport'),
        key: "MAIN",
        children: [
          {
            key: "OPENING_REPORT",
            label: "{name}" + this.$t('graduationDesign.openingReport')
          }
        ]
      },
      actionType: 'ADD',
      selectedData: [], // 勾选的列表数据
      loading: false,
      progressData: [], // 审核进度列表
      studentForm: {},
      openingReportForm: {},
      stuType: '',
      newKey: ''
    };
  },
  computed: {
    breadName: function () {
      let label = this.$t('graduationDesign.add');
      if (this.actionType === "EDIT") {
        label = this.$t('graduationDesign.edit');
      } else if (this.actionType === "REVIEW_VIEW") {
        label = this.$t('graduationDesign.view');
      }
      return label;
    }
  },
  async created() {
    this.studentForm = await this.getStudentInfo() || {};
    this.getStudentType(this.studentForm);
  },
  mounted() {
    this.searchList();
  },
  methods: {
    searchList() {
      this.$refs.submitOpeningReportTable.search(this.queryForm);
    },
    handleSelectChange(val) {
      this.selectedData = val;
    },
    // 查学生信息
    getStudentInfo() {
      return this.api.getStudentInfo({}).then(res => {
        return res.data;
      }).catch(() => { });
    },
    // 查课题名称信息
    getSubjectDetail() {
      return this.api.getSubjectDetail().then(res => {
        return res.data;
      });
    },
    // 查学生文科理科（文科：1，理科：2）
    getStudentType(params = {}) {
      this.api.getStuArtsOrSciences(params).then(({ data }) => {
        this.stuType = data;
      });
    },
    async onAdd() {
      this.actionType = "ADD";
      const subjectDetail = await this.getSubjectDetail();
      this.openingReportForm = Object.assign({}, subjectDetail, this.studentForm);
      this.indexKey = "OPENING_REPORT";
    },
    async onEdit(row) {
      this.actionType = "EDIT";
      const subjectDetail = await this.getSubjectDetail();
      this.api.getReportDetail(row.id).then(({ data }) => {
        this.indexKey = "OPENING_REPORT";
        this.openingReportForm = Object.assign({}, data, subjectDetail, this.studentForm);
      });
    },
    // 撤销
    onRevoke(row) {
      this.$eduConfirm(this.$t('graduationDesign.revokeConfirmTips'), this.$t('graduationDesign.prompt')).then(() => {
        const params = {
          idList: [row.flowNo || ""],
          status: "Recall",
          approvalRank: 1
        };
        this.api.approval(params).then(res => {
          this.$message.success(this.$t('graduationDesign.revokeSuccess'));
          this.searchList();
        });
      }).catch(() => { });
    },
    onDelete(row) {
      this.$delConfirm(this.$t('graduationDesign.deleteConfirm'), this.$t('graduationDesign.delete')).then(() => {
        const params = { ...row };
        this.api.delete(params).then(res => {
          this.$message.success(this.$t('graduationDesign.deleteSuccess'));
          this.searchList();
        });
      }).catch(() => { });
    },
    // 查看
    async onView(row) {
      this.actionType = "VIEW";
      const subjectDetail = await this.getSubjectDetail();
      this.api.getReportDetail(row.id).then(({ data }) => {
        this.indexKey = "OPENING_REPORT";
        this.openingReportForm = Object.assign({}, data, subjectDetail);
      });
    },
    // 保存开题报告
    onSave(data, action) {
      let reqApi = null;
      if (action === "ADD") {
        reqApi = this.api.save(data);
      } else {
        reqApi = this.api.update(data);
      }
      reqApi.then(res => {
        this.$message.success(this.$t('graduationDesign.saveSuccess'));
        this.indexKey = "MAIN";
        this.searchList();
      }).catch(() => { });
    },
    // 提交开题报告
    onSubmit(data) {
      this.api.submit(data).then(res => {
        this.$message.success(this.$t('graduationDesign.submitSuccess'));
        this.indexKey = "MAIN";
        this.searchList();
      }).catch(() => { });
    },
    onCancel() {
      this.indexKey = "MAIN";
      this.searchList();
    },
    // 导出PDF
    onExport() {
      const params = {
        identity: "4", // 学生
        condition: this.queryForm,
        selectList: this.selectedData
      };
      this.newKey = "";
      this.api.export(params).then(res => {
        if (res.code == 200) {
          tools.downloadZip(res.data.key,
            `/api/designservice/openReport/exportReport/${res.data.data.newKey}`,
            "提交开题报告.zip",
            this.api.getFileExportStatus, this
          );
          /*this.delayRequest(res.data.key);
          this.newKey = res.data.data.newKey;*/
        }
      });
    },
    getExportStatus(key) {
      return this.api.getFileExportStatus(key).then(res => {
        return res;
      }).catch(err => {
        this.loading = false;
      });
    },
    // 查文件导出状态，等待导出
    async delayRequest(key) {
      this.loading = true;
      await new Promise(resolve => setTimeout(resolve, 3000));
      const resData = await this.getExportStatus(key);
      if (resData.code === 200 && resData.data.status) {
        this.loading = false;
        window.open("/api/designservice/openReport/exportReport/" + this.newKey);
      } else {
        this.delayRequest(key);
      }
    }
  },
  components: {
    OpeningReportInfo: () => import('../components/openingReportInfo')
  }
}
</script>
<style lang="scss" scoped>
</style>
